<template>
<div class="page">
  <nav-com
    title="账户注销"
    :showView="true"
    @back="backHandler()"></nav-com>
    <div style="margin: 0px 10px;line-height: 50px;">手机号：{{userMobile}}</div>
    <div class="padd_box" style="display: flex;margin-top: 10px;margin-right: 10px;margin-left: 10px;align-items: center;justify-content: space-between;">
      <van-col span="12">
        <div class="">
          <van-field
            label-class="label"
            :border="true"
            type="number"
            style=""
            v-model="captcha"
            placeholder="请输入验证码"
          />
        </div>
      </van-col>
      <van-col span="10" style="text-align: right">
        <div
          class="login_box"
          @click="codeHandler"
          v-if="codeFalg"
          style="text-align: center"
        >
          {{ codeText }}
        </div>
        <div
          class="login_box"
          v-else
          style="text-align: center"
        >
          {{ codeText }}
        </div>
      </van-col>
    </div>
  <!-- <van-field label-class="label" style="margin: 10px 10px;" v-model="num" placeholder="请输入转增数量"  label="转增数量" />
  
  <van-field label-class="label" style="margin: 10px 10px;" @blur="transferUserHandler" v-model="mobile" placeholder="请输入对方手机号"  label="对方手机号" />
  <div style="margin: 0px 10px;line-height: 50px;">{{userName}}</div> -->
  <div class="btn" @click="transfer">确认注销</div>
</div>
</template>

<script>
import navCom from "@/component/nav";
import {Toast} from "vant";
import {couponIncrease ,score_send,verify_mobile,getFttuserUserId2, cancellation }  from '@/api/api'
export default {
  name: "index",
  components: {
    navCom,
  },
  data(){
      return {
        mobile:"",
        codeText:'获取验证码',
        codeFalg:true,
        refDisabled:false,
        captcha:"",
        userMobile:"",
        userName:"",
        num:'',
      }
  },
  mounted() {
    getFttuserUserId2().then(res=>{
                console.log("getFttuserUserId2",res);
                if(res.data.code == 1){
                    let cellphone = res.data.data.mobile
                    this.userMobile =cellphone

                }
    })
  },
  methods: {
    backHandler() {
      this.$router.go(-1);
    },
   
    // transferUserHandler(){
    //   if(!this.mobile.trim()){
    //     Toast("手机号不可以为空");
    //   }else{
    //     verify_mobile({
    //       mobile: this.mobile
    //     }).then((res) => {
    //       console.log(res);
    //       if (res.data.code == 1) {
    //           this.userName=res.data.data.name;
    //       } else {
    //         this.$dialog.alert({
    //           message: res.data.msg,
    //         });
    //       }
    //     });
    //   }
     
    // },
       //获取验证码
       codeHandler() {
      let that = this;
      let telLen = this.userMobile.length;
      if (telLen == 11) {
        let time = null;
        clearInterval(time);
        that.codeFalg = false;
        let t = 60;
        time = setInterval(function () {
          t--;
          that.codeText = t;
          if (t <= 0) {
            that.codeText = "获取验证码";
            that.codeFalg = true;
            clearInterval(time);
          }
        }, 1000);

        score_send({
          mobile: this.userMobile
        }).then((res) => {
          if (res.code == 1) {
          } else {
            this.$dialog.alert({
              message: res.data.msg,
            });
          }
        });
        return true;
      } else {
        this.message = "请输入正确手机号";
        return false;
      }
    },
  async transfer(){
       console.log(this.$route.params.id)
      if(!this.captcha.trim()){
        Toast('不可以为空');
      }else{
          const res=  await cancellation({
            captcha:this.captcha
          })
          Toast(res.data.msg);
          if(res.data.code==1){
            localStorage.removeItem("shareUser");
            window.weixin.removeToken();
            if(weixin.isAndroid()){
               window.JS_TROOPS.clearCache()
               window.JS_TROOPS.dealLoginOut();
               window.JS_TROOPS.logOff();
            }
            this.$router.push('/login')
          }
      }
  }
  },
}
</script>

<style scoped>
.page{
  width: 100vw;
  height: 100vh;
  background: #F5F5F5;
}
.btn{
  width: 93.6vw;
  height: 13.3vw;
  background: #FF8933;
  margin: 0 auto;
  font-size: 4.5vw;
  text-align: center;
  line-height: 13.3vw;
  margin-top: 5.6vw;
  font-family: PingFangSC-Medium, PingFang SC;
  /*font-weight: 500;*/
  color: #FFFFFF;
  border-radius: 1vw;
}
.label{
  font-size: 4.5vw;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #333333;
}
.login_box {
  /* border: 1px solid #F86931; */
  color: #fff;
  background: #FF8933;
  font-size: 4.2vw;
  border-radius: 10px;
  line-height: 45px;
}
.login_box label {
  color: #fff;
  padding-left: 5.3vw;
}
.login_box input {
  height: 11vw;
  line-height: 11vw;
  width: 50vw;
  border: none;
}
</style>